<template>
  <div>

    <h2> 用户详情 </h2>

    <img
      :src="user.avator"
      style="border-radius:50%; width:50px;height:50px"
    >
    <br>
    <br>
    姓名 : <input
      name="name"
      type="text"
      v-model="user.name"
    >
    <br>
    年龄: <input
      name="age"
      type="text"
      v-model="user.age"
    >
    <br>
    性别: <input
      name="sex"
      type="text"
      v-model="user.sex"
    >
    <br>
    介绍：<textarea v-model="user.detail"> </textarea>
    <br>
    <button @click="onSubmit">提交</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      user: {},
      formLayout: "horizontal",
      form: this.$form.createForm(this, { name: "userform" })
    };
  },
  created() {
    this.$store.dispatch("GET_USER", this.$route.params.id).then(() => {
      this.user = this.$store.state.user;
    });
  },
  methods: {
    onSubmit() {
      this.$store.dispatch("UPDATE_USER", this.user).then(res => {
        console.log("res", res);

        if (res.success) {
          // 成功
          this.$message.info(res.message);
          this.$router.push("/admin/user");
        } else {
          // 失败
          this.$message.error(res.message);
        }
      });
    }
  }
};
</script>